<template>
    <div class="anti-harass-config">
      <el-card class="config-card">
        <!-- 主动私信说明 -->
        <div class="tip-section">
          <span class="tip-text">距离上次信息超过14H，视为主动私信</span>
        </div>
        
        <!-- 跟进频次设置 -->
        <div class="section-title">跟进客户频次：</div>
        
        <div class="config-item">
          <span class="label">电话不得超过</span>
          <el-input 
            v-model="formData.followFrequency.phone" 
            placeholder="3" 
            class="number-input"
            type="number"
            min="0"
          />
          <span class="suffix">次/周</span>
        </div>
        
        <div class="config-item">
          <span class="label">主动私信不得超过</span>
          <el-input 
            v-model="formData.followFrequency.message" 
            placeholder="5" 
            class="number-input"
            type="number"
            min="0"
          />
          <span class="suffix">次/周</span>
        </div>
        
        <div class="config-item">
          <span class="label">短信不得超过</span>
          <el-input 
            v-model="formData.followFrequency.sms" 
            placeholder="2" 
            class="number-input"
            type="number"
            min="0"
          />
          <span class="suffix">次/周</span>
        </div>
        
        <!-- 黑名单设置 -->
        <div class="tip-section" style="margin-top: 20px;">
          <span class="tip-text">黑名单库客户，禁止主动联系</span>
        </div>
        
        <div class="blacklist-tip">
          <span>平台黑名单的优先级大于机构黑名单</span>
        </div>
      </el-card>
    </div>
  </template>
  
  <script>
  export default {
    name: 'AntiHarassConfig',
    props: {
      configData: {
        type: Object,
        default: () => ({})
      }
    },
    data() {
      return {
        formData: {
          followFrequency: { phone: '', message: '', sms: '' }
        }
      }
    },
    watch: {
      configData: {
        immediate: true,
        handler(newVal) {
          if (newVal) {
            this.formData = { ...this.formData, ...newVal }
          }
        }
      }
    },
    methods: {
      getFormData() {
        return this.formData
      },
      handleReset() {
        this.formData = {
          followFrequency: { phone: '', message: '', sms: '' }
        }
      }
    }
  }
  </script>
  
  <style scoped>
  .anti-harass-config {
    padding: 20px;
  }
  
  .config-card {
    padding: 20px;
  }
  
  .tip-section {
    margin-bottom: 20px;
    padding: 10px;
    background-color: #fef0f0;
    border-left: 4px solid #f56c6c;
  }
  
  .tip-text {
    color: #f56c6c;
    font-weight: bold;
  }
  
  .section-title {
    font-weight: bold;
    margin-bottom: 15px;
    color: #303133;
    font-size: 14px;
  }
  
  .config-item {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    padding: 8px 0;
  }
  
  .label {
    margin-right: 10px;
    color: #606266;
    font-size: 14px;
    min-width: 120px;
  }
  
  .number-input {
    width: 80px;
    margin: 0 10px;
  }
  
  .suffix {
    color: #606266;
    font-size: 14px;
  }
  
  .blacklist-tip {
    margin-top: 10px;
    padding: 10px;
    background-color: #f4f4f5;
    border-radius: 4px;
    color: #909399;
    font-size: 13px;
  }
  </style>